<template>
  <div class="leftNav">
    <ul>
      <li>
        <i class="icon iconfont icon-goumai"></i>
        <a href="#goumai">收银</a>
      </li>
      <li>
        <i class="icon iconfont icon-dianpu"></i>
        <a href="#dianpu">店铺</a>
      </li>
      <li>
        <i class="icon iconfont icon-huiyuanqia"></i>
        <a href="#huiyuanqia">会员</a>
      </li>
      <li>
        <i class="icon iconfont icon-shouji"></i>
        <a href="#shouji">统计</a>
      </li>
      <li>
        <i class="icon iconfont icon-gongnengjianyi"></i>
        <a href="#gongnengjianyi">设置</a>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "leftNav",
};
</script>

<style lang="less" scoped>
.leftNav {
  width: 10%;
  height: 100vh;
  background: #1d8ce0;
  float: left;
  box-sizing: border-box;
  ul {
    list-style: none;
    li {
      border-bottom: 1px solid #20a0ff;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      margin: 10px 0;
      padding: 10px 0;
      i.iconfont {
        font-size: 34px;
        color: #fff;
      }
      a {
        text-decoration: none;
        color: #fff;
        font-size: 16px;
      }
    }
  }
}
</style>
